﻿/********************************************
author jimmy
create date 2012-11-30
use 
<form id ="form">
<div>
	<a href="javascript:;" onclick="uploader.addFile(this);">添加图片</a>
</div>
<div id="fileList">
</div>
</form>
<script src="js/jquery.min.js" type="text/javascript"></script>
<script src="js/jquery.form.js" type="text/javascript"></script>
<script src="js/upload.js" type="text/javascript"></script>
<script>
var uploader = new MyUploader();
</script>
*********************************************/
function MyUploader(config) {
	var _uploader = this;
	_uploader.formId = '';//用于提交的formid
	_uploader.formAction = '';
	_uploader.uploadAction = '';//用于上传的action
	_uploader.fileClass = 'stfile_image';
	_uploader.fileHttpPathClass = 'stfile_http_path';
	
	_uploader.isBusy = false;
	_uploader.quene = new Array();
	
	_uploader.auto = true;//自动上传
	_uploader.currentActiveFileId = '';//当前上传文件id
	
	
	if(config){
		if(config.formId)
			_uploader.formId = config.formId;
		if(config.uploadAction)
			_uploader.uploadAction = config.uploadAction;
	}
	
	if(!_uploader.formId || !_uploader.uploadAction){
		alert("need a formId or upload action");
		return;
	}
	_uploader.uploadInit = function(){
		var aspnetform = $('#' + _uploader.formId); 
		_uploader.formAction = aspnetform.attr('action');
	};

	_uploader.addFile = function(elm){
		var counter = $(elm).attr("counter");
		if(!counter){
			counter = 1;
		}
		var fileListContainer = $('#fileList');
		var file_id = _uploader.fileClass + '_'+ counter.toString() ;
		var file_http_path_id = _uploader.fileHttpPathClass + '_'+ counter.toString() ;
		var template = 
		'<div id="stsug" class="stsug" style="">' +
			'<div class="stf">' +
					'<span>粘贴图片网址</span>' +
					'<span class="partition">|</span>' +
					'<a name="uploadImg" href="javascript:void(0)">' +
						'从本地上传<input type="file" class="stfile_image" name="' + file_id + '"  id="'+ file_id +'" ref="'+ file_http_path_id +'" />' +
					'</a><div id="loading_'+ file_id +'" style="display:none;" class="loading"></div>' +
			'</div>' +
			'<div id="sturl">' +
				'<span class="stuwr">' +
					'<input type="text" id="'+ file_http_path_id +'" value="" autocomplete="off" class="stuurl" maxlength="250"  size="42" name="stfile_http_path[]"/>' +
				'</span>' +
			'</div> ' +
		 '</div>';
		var fileContainer = $(template);
		fileListContainer.append(fileContainer);
		
		_uploader.initFile(file_id);
		
		counter++;
		$(elm).attr("counter", counter);
	};

	_uploader.initFile = function(elmid){
		var fileElm = document.getElementById(elmid);
		fileElm.onchange = function() { 
			$('#'+this.id).hide();
			_uploader.quene.push(this.id);
			_uploader.checkQuene();
		} 
	};
	
	_uploader.checkQuene = function(){
		if(_uploader.quene.length > 0 && !_uploader.isBusy){
			_uploader.isBusy = true;
			var elmid = _uploader.quene.shift();
			_uploader.currentActiveFileId = elmid;
			_uploader.doSubmit(elmid);
		}
	};
	
	_uploader.doSubmit = function(elmid){
		var path = $('#'+elmid).val();
		if(path != "" && path != undefined){
			//set active file

			var aspnetform = $('#' + _uploader.formId); 
			aspnetform.append($('<input type="hidden" name="active_file" id="active_file_' + elmid +'" value="' + elmid + '" />'));
			
			_uploader.uploadsubmit(_uploader.uploadAction,
			function(response){//success
				var httpPathId = $('#'+elmid).attr('ref');
				$('#' + elmid)[0].outerHTML = $('#' + elmid)[0].outerHTML;
				_uploader.initFile(elmid);
				try{
					jsonObj = $.parseJSON(response);
					if(jsonObj.result == "success"){
						$('#' + httpPathId).val(jsonObj.url);
					}else{
						alert("上传失败");
					}
				}catch(err){
					alert(err+response);
				}
				
				//check queue
				$('#active_file_' + elmid ).remove();
				_uploader.isBusy = false;
				_uploader.checkQuene();
				
				$('#'+elmid).show();
				$('#loading_'+elmid).hide();
				$('#cancel_'+elmid).hide();
				$('input[type=submit]').show();
			},
			function(response){//beforeSubmit
				$('input[type=submit]').hide();
				$('#loading_'+elmid).show();
				$('#cancel_'+elmid).show();
			});
		}
	};

	_uploader.uploadsubmit = function(url,success,beforeSubmit) {
		var aspnetform = $('#' + _uploader.formId); 

		aspnetform.attr({ 'action': url });

		aspnetform.ajaxSubmit({
			success: function(response) {
				/*clear*/
				var aspnetform = $('#' + _uploader.formId); 
				aspnetform.attr({ 'action': _uploader.formAction });

				if (typeof (success) == "function") {
					success.apply(this, [response]);
				}
			},
			beforeSubmit: function(response) {

				if (typeof (beforeSubmit) == "function") {
					beforeSubmit.apply(this, [response]);
				}
			}

		});
	};
		
	_uploader.uploadInit();

}
